<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>jQuery UI Tabs - Default functionality</title>
        <link rel="stylesheet" href="themes/ui-lightness/jquery.ui.all.css">
        <link type="text/css" href="apycommenus/menu.css" rel="stylesheet" />
        <link rel="stylesheet" href="bannerrotator/bannerrotator.css">
        <link rel="stylesheet" href="jquerydatatable/jquery.dataTables.css">
		<link rel="stylesheet" href="mycss/common.css">		
        <script src="jquery-1.7.1.js" type="text/javascript"></script>
		<script src="ui/jquery.ui.core.js"></script>
        <script src="ui/jquery.ui.widget.js"></script>
        <script src="ui/jquery.ui.tabs.js"></script>
        <script src="ui/jquery.ui.mouse.js"></script>
        <script src="ui/jquery.ui.sortable.js"></script>
        <script src="ui/jquery.ui.button.js"></script>
		<script src="ui/jquery.ui.draggable.js"></script>
		<script src="ui/jquery.ui.position.js"></script>
		<script src="ui/jquery.ui.resizable.js"></script>
		<script src="ui/jquery.ui.dialog.js"></script>
		<script src="ui/jquery.effects.core.js"></script>

        <script type="text/javascript" src="apycommenus/menu.js"></script>
        <script type="text/javascript" src="bannerrotator/bannerrotator.js"></script>

        <script type="text/javascript" language="javascript" src="tablemedia/js/jquery.dataTables.js"></script>
		
        <style type="text/css" title="currentStyle">
            @import "tablemedia/css/demo_page.css";
            @import "tablemedia/css/demo_table_jui.css";
            @import "../examples_support/themes/smoothness/jquery-ui-1.8.4.custom.css";
        </style>
                
        
        <script>
            $(function() {
                $( "#sortable" ).sortable({
                    placeholder: "ui-state-highlight"
                });
                $( "#sortable" ).disableSelection();
            });
        </script>

        <script>
            $(function() {
                $( "#tabs" ).tabs();
            });
        </script>
        <script>
            $(document).ready(function(){
                $("body div:last").remove();
            });
        </script>
        <script>
            $(function() {
                $( "button", "#rightcontrols" ).button();
                $( "button", "#rightcontrols" ).click(function() { return false; });
            });
        </script>
		
		<script>
			$(function() {
				// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
		
				
				$( "#dialog-form" ).dialog({
					autoOpen: false,
					height: 300,
					width: 600,
					modal: true,
					close: function() {
						allFields.val( "" ).removeClass( "ui-state-error" );
					}
				});
		
				$( "#btnLookUp" )
					.button()
					.click(function() {
						$( "#dialog-form" ).dialog( "open" );
					});
			});
		</script>
		
		<script type="text/javascript" charset="utf-8">
            $(document).ready(function() {
                $("#addressLists").dataTable( {
                    "sScrollY": 200,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
					
                } );				
				  
            } );
        </script> 
    </head>
    <body>
        <div id="container">
            <div id="header">
                <div class="rotator">
                    <ul>
                        <li class="show"><a href="#link1"><img src="bannerrotator/images/image-2.jpg" width="1012" height="200"  alt="pic1" /></a></li>
                        <li><a href="#link3"><img src="bannerrotator/images/image-3.jpg" width="1012" height="200"  alt="pic3" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-4.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-5.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-6.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                    </ul>
                </div>
            </div>
            <div id="menu">
                <ul class="menu">
                    <li><a href="#" class="parent"><span>Organisations</span></a></li>
                    <li>
                        <a href="#" class="parent"><span>Services</span></a>
                        <ul>
                            <li><a href="#" class="parent"><span>Service Maintainance</span></a></li>
                            <li><a href="programList.html" class="parent"><span>Program Maintainance</span></a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="#" class="parent"><span>Geography</span></a>
                        <ul>
                            <li><a href="goverment_office_region_list.html"><span>Goverment Office Region</span></a></li>
                        </ul>
                    </li>
                    <li><a href="#" class="parent"><span>Premises</span></a></li>
                </ul>
                <div id="welcomepanel">
                    <a href="#">Welcome: project manager | </a><a href="login.html">Log out</a>
                </div>
            </div>
            <div id="content">
                <div id="maincontent">
                    <div id="maincontentheader">
                        Title of content
                    </div>
                    <div id="tabs">
                        <div class="ui-tabs-panel">
							 <input type="button" id="btnLookUp" name="btnLookUp" value="Look Up" />
                        </div>
                    </div>
                </div>
            </div>
            <div id="footer">
                <div style="width: 80%; margin:25px auto; text-align: center;
                     font-weight: bold; color: #F6AE38;">
                    Fresher 10 - mock project - bad team designed
                </div>
            </div>
        </div>
		
		
		
		<div id="dialog-form" title="Address" style="font-size:12px; font:'Times New Roman', Times, serif">
           <table style="width: 100%; border: 0px;" cellpadding="3" cellspacing="0" id="addressLookUp">
               <tr>
              	 <td style="text-align:center;">
              	 	<div id="search"> 
		                 <table style="width:99%; border: 1px; border-bottom: 2pt; border-top: 2pt" cellpadding="3" cellspacing="0">
		                 	<tr>
		                 		<td>Postcode: </td>
		                 		<td><input id="postcodeTxt" name="txt" type="text"/></td>
		                 		<td>Street: </td>
		                 		<td><input id="streetTxt" name="txt" type="text"/></td>
		                 		<td>Town: </td>
		                 		<td><input id="townTxt" name="txt" type="text"/></td>
		                 	</tr>
		                 </table>
                 	</div>
                 </td>
              </tr>
              <tr>
                 <td align="left">
                    <div id="buttonTop">
                       <input id="btnSearchAddress" name="btn" type="button" value="Search Address" />
                       <input id="btnNone" name="btn" type="button" value="None" />
                       <input id="btnClear" name="btn" type="button" value="Clear" />
                    </div>
                 </td>
              </tr>
              <tr>
                 <td>&nbsp;</td>
              </tr>
              <tr>
                 <td style="text-align: center;">
                    <div >
                    	<table id="addressList" style="width: 99%;" border="1">
                    		<tr>
                    			<td width="5%" ></td>
                    			<td width="35%"><b>Address</b></td>
                    			<td width="15%"><b>Post code</b></td>
                    			<td width="15%"><b>Town</b></td>
                    			<td width="15%"><b>County</b></td>
                    			<td width="15%"><b>Country</b></td>                    			
                    		</tr>
							<tr>
								<td><input type="radio" checked="checked" /></td>
								<td>10 Maurer Court Greenwich</td>
								<td>SE10 OSS</td>
								<td>London</td>
								<td>Greenwich</td>
								<td>Britain</td>
							</tr>
							<tr>
								<td><input type="radio" /></td>
								<td>10 Maurer Court Greenwich</td>
								<td>SE10 OSS</td>
								<td>London</td>
								<td>Greenwich</td>
								<td>Britain</td>
							</tr>
							<tr>
								<td><input type="radio" /></td>
								<td>10 Maurer Court Greenwich</td>
								<td>SE10 OSS</td>
								<td>London</td>
								<td>Greenwich</td>
								<td>Britain</td>
							</tr>
                    	</table>
                    </div>
                 </td>
              </tr>
              <tr>
              	<td colspan="2" align="left">
                    <div id="buttonBottom">
                       <input id="btnSelect" name="btn" type="button" value="Select" />
                       <input id="btnClose" type="button" value="Close" />
                    </div>
                 </td>
              </tr>
             
           </table>
        </div>
		
		
    </body>
</html>

